<template>
	<view>
		<view class="uni-form-item uni-column">
			<view class="title">名称</view>
			<input class="uni-input" v-model="FormData.ename" focus placeholder="请输入名称" />
		</view>
		<view class="uni-form-item uni-column">
			<view class="title">手机号</view>
			<input class="uni-input" v-model="FormData.phone" placeholder="请输入手机号" />
		</view>
		<view class="uni-form-item uni-column">
			<view class="title">邮箱号</view>
			<input class="uni-input" v-model="FormData.email" placeholder="请输入邮箱号" />
		</view>
		<view class="uni-form-item uni-column">
			<view class="title">地址</view>
			<input class="uni-input" v-model="FormData.address" placeholder="请输入地址" />
		</view>
		<view class="uni-form-item uni-column">
			<view class="title">身份证号</view>
			<input class="uni-input" v-model="FormData.id_card" placeholder="请输入身份证号" />
		</view>
		<view class="uni-form-item uni-column">
		  <view class="title">性别(选择)</view>
		</view>
		<wlRadio :labelList='labelList' @radioValue='radioValue'></wlRadio>
		<view class="uni-form-item uni-column">
		  <view class="title">业主类型</view>
		</view>
		<wlRadio :labelList='labelList1' @radioValue='radioValue1'></wlRadio>
		<view class="uni-padding-wrap uni-common-mt">
			<button type="primary" @click="editInfo">提交信息</button>
		</view>
	</view>
</template>

<script>
	import uniList from '@/components/uni-list/uni-list'
	import uniListItem from '@/components/uni-list-item/uni-list-item'
	import wlRadio from '@/components/wl-group/wl-radio.vue'
	
	export default {
		components: {
			uniList,
			uniListItem,
			wlRadio,
		},
		data() {
			return {
				FormData: '',
				labelList: [
					{ value: '0', checked: '', name: '男' },
					{ value: '1', checked: '', name: '女' },
				],
				labelList1: [
					{ value: '0', checked: '', name: '业主' },
					{ value: '1', checked: '', name: '租客' },
					{ value: '2', checked: '', name: '其他' },
				],
			}
		},
		mounted() {
			let params = {
				page: 1,
				limit: 10,
			};
			this.init(params);
		},
		methods: {
			init(params) {
				params.id = uni.getStorageSync('user').id
				params.type = 2
				this.$api.getPersonalInformation(params).then((res) => {
					this.FormData = res.rows[0]
					console.log(res.rows[0].sex)
					if (res.rows[0].sex == 0) {
						this.labelList[0].checked = true
					} else if (res.rows[0].sex == 1) {
						this.labelList[1].checked = true
					} else {
						this.labelList[0].checked = true
					}
					if (res.rows[0].etype == 0) {
						this.labelList1[0].checked = true
					} else if (res.rows[0].etype == 1) {
						this.labelList1[1].checked = true
					} else if (res.rows[0].etype == 2) {
						this.labelList1[2].checked = true
					} else {
						this.labelList1[0].checked = true
					}
					
				}).catch((err) => {
					console.log('request fail', err);
				})
			},
			// 获取性别值
			radioValue(e) {
				this.FormData.sex = e
				console.log(this.FormData.sex)
			},
			// 获取性别值
			radioValue1(e) {
				this.FormData.etype = e
				console.log(this.FormData.etype)
			},
			editInfo() {
				let params = {}
				params.id = this.FormData.role_id
				params.type = this.FormData.etype
				params.name = this.FormData.ename
				params.phone = this.FormData.phone
				params.address = this.FormData.address
				params.idCard = this.FormData.id_card
				params.email = this.FormData.email
				params.sex = this.FormData.sex
				console.log(this.FormData)
				this.$api.updateCustomer(params).then((res) => {
					if(res.success) {
						uni.showToast({
							icon: 'success',
							title: "提交成功",
							duration: 2000,
						});
						setTimeout((i) =>{
							uni.redirectTo({
							   url: "userInfo",
							});
						},500)
					}else {
						uni.showToast({
							icon: 'none',
							title: '提交失败',
							duration: 2000
						});
					}
				}).catch((err) => {
					console.log('request fail', err);
				})
			},
			onCancel(e) {
				console.log(e)
			},
			onConfirm(e) {
				this.pickerText = e.label
				this.FormData.address = this.pickerText
			},
			// 三级联动选择
			showMulLinkageThreePicker() {
				this.$refs.mpvueCityPicker.show()
			},
		}
	}
</script>

<style>
	page {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		background-color: #efeff4
	}

	view {
		font-size: 28upx;
		line-height: inherit
	}

	.example {
		padding: 0 30upx 30upx
	}

	.example-title {
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size: 32upx;
		color: #464e52;
		padding: 30upx 30upx 30upx 50upx;
		margin-top: 20upx;
		position: relative;
		background-color: #fdfdfd;
		border-bottom: 1px #f5f5f5 solid
	}

	.example-title__after {
		position: relative;
		color: #031e3c
	}

	.example-title:after {
		content: '';
		position: absolute;
		left: 30upx;
		margin: auto;
		top: 0;
		bottom: 0;
		width: 6upx;
		height: 32upx;
		background-color: #ccc
	}

	.example .example-title {
		margin: 40upx 0
	}

	.example-body {
		padding: 30upx;
		background: #fff
	}

	.example-info {
		padding: 30upx;
		color: #3b4144;
		background: #fff
	}
</style>